import React from 'react';
import './Home.css'
import { useNavigate } from 'react-router-dom';

function Home() {
    const navigate = useNavigate();
    const handleClick = function(path){
        navigate(path);
    }
    return (
        <div className='home'>
            <div className='content'>
                <img src='../img/main.jpg'></img>
                <div className='adopt'>
                    <h1>给TA一个温暖的家吧~</h1>
                    <p>Taking care of pets.</p>
                    <button onClick={()=>handleClick('/adoptcenter')}>去领养</button>
                </div>
                <img src='../img/pet.jpg'></img>
                <div className='adopt'>
                    <h1>为小可爱寻找主人</h1>
                    <p>Finding owners for pets.</p>
                    <button onClick={()=>handleClick('/petInfo')}>去登记</button>
                </div>
                <div className='ad'>
                    <h1>!!!广告位招租!!!</h1>
                </div>
            </div>
        </div>
    )
}

export default Home;